<template>
    <el-row  style="font-size: small">
      <el-col :span="9">
        <div style="width: 530px;height: 695px;margin-left:40px;border: solid 1px darkgray">
          <el-row style="margin-bottom: 20px">
            <span style="float: left;margin: 10px 0 0 10px "><b>基础检查信息</b></span>
          </el-row>
          <el-row style="margin-bottom: 20px">
            <el-col :span="8">
              <span style="float: left;padding-left: 10px">体温: 36 摄氏度</span>
            </el-col>
            <el-col :span="8">
              <span style="float: left;padding-left: 10px">脉搏: 60 次/分</span>
            </el-col>
            <el-col :span="8">
              <span style="float: left;padding-left: 10px">血压: 124 MMGH</span>
            </el-col>
          </el-row>
          <el-row style="margin-bottom: 20px">
            <el-col :span="8">
              <span style="float: left;padding-left: 10px">身高: 168 CM</span>
            </el-col>
            <el-col :span="8">
              <span style="float: left;padding-left: 10px">体重: 53 KG</span>
            </el-col>
            <el-col :span="8">
              <span style="float: left;padding-left: 10px">血糖: 52 MMOL/L</span>
            </el-col>
          </el-row>
          <hr style="width: 500px">
          <el-row style="margin-bottom: 20px">
            <span style="float: left;margin: 10px 0 0 10px "><b>病历信息</b></span>
          </el-row>
          <el-row style="width: 570px;margin-bottom: 20px" >
            <el-col :span="12" >
              <span style="float: left;padding-left: 10px">发病时间: 2023-05-21 09:00:00</span>
            </el-col>
            <el-col :span="12">
              <span style="float: left;padding-left: 10px">主要病症: 头痛、发热、头晕、恶心</span>
            </el-col>
          </el-row>
          <el-row style="width: 570px;margin-bottom: 20px" >
            <el-col :span="12" >
              <span style="float: left;padding-left: 10px">近期病史: 一个月前有发烧症状</span>
            </el-col>
            <el-col :span="12">
              <span style="float: left;padding-left: 10px">遗传病史: 无</span>
            </el-col>
          </el-row>
          <el-row style="width: 570px;margin-bottom: 20px" >
            <el-col :span="12" >
              <span style="float: left;padding-left: 10px">过敏原: 无</span>
            </el-col>
            <el-col :span="12">
              <span style="float: left;padding-left: 10px">辅助检查: 无</span>
            </el-col>
          </el-row>
          <el-row style="width: 570px;margin-bottom: 20px" >
            <el-col :span="12" >
              <span style="float: left;padding-left: 10px">初步诊断: 流行性感冒</span>
            </el-col>
          </el-row>
          <el-row style="width: 570px;margin-bottom: 20px" >
            <el-col :span="12" >
              <span style="float: left;padding-left: 10px">治疗建议: 多休息，药物辅助</span>
            </el-col>
          </el-row>
          <hr style="width: 500px">
          <el-row style="margin-bottom: 20px">
            <div style="float: left;margin: 10px 0 0 10px "><b>处方信息</b></div>
          </el-row>
          <el-row style="width: 560px;height: 44px">
            <div style="height: 100%;width: 505px;background-color: #ECECEC;margin-left: 10px">
              <el-row style="padding-top: 10px;text-align: left">
                <el-col :span="3" style="text-align: center"><b>序号</b></el-col>
                <el-col :span="5"><b>处方药品</b></el-col>
                <el-col :span="2"><b>数量</b></el-col>
                <el-col :span="2"><b>单位</b></el-col>
                <el-col :span="12"><b>用法</b></el-col>
              </el-row>
            </div>
          </el-row>
          <div v-for="item in 4" class="d2" style="border: solid 1px darkgray;width: 505px;height: 44px;margin:10px 0 0 10px">
            <el-row  style="padding: 14px 0 13px 0;text-align: left">
              <el-col :span="3" style="text-align: center">{{item}}</el-col>
              <el-col :span="5">三只九感冒药</el-col>
              <el-col :span="2">2</el-col>
              <el-col :span="2">盒</el-col>
              <el-col :span="12">饭后口服，每日两次，一次一小包</el-col>
            </el-row>
          </div>
        </div>
      </el-col>
      <el-col  :span="15" >
        <div  v-for="item in 5" class="d1" style="width: 975px;height: 118px;border: solid 1px darkgray;margin-bottom: 24px;">
          <el-row style="width: 100%;height: 100%">
            <el-col :span="6" style="text-align: center;line-height: 118px">2023-05-21 09:00:00</el-col>
            <el-col :span="18">
              <el-row style="margin-top: 30px;text-align: left">
                <el-col :span="8">就诊编号：YLJCD00001</el-col>
                <el-col :span="8">诊断病情：流行性感冒</el-col>
                <el-col :span="8">就诊类型：初诊</el-col>
              </el-row>
              <el-row style="margin-top: 20px;text-align: left">
                <el-col :span="8">接诊科室：体检科</el-col>
                <el-col :span="8">接诊医生：王医生</el-col>
                <el-col :span="8">接诊状态：接诊中</el-col>
              </el-row>
            </el-col>
          </el-row>
        </div>
      </el-col>
    </el-row>
  <div class="divPagination">
    <el-pagination
        v-model:current-page="currentPage"
        layout="prev, pager, next, jumper"
        :total="10000"
        @current-change="handleCurrentChange"
    />
  </div>
</template>

<script setup>
import { ref } from 'vue'


const currentPage = ref(1)
const handleCurrentChange = () => {
}


</script>

<style>
.divPagination{
  position: relative;
  left: 1100px;
  top: 0
}

.d1 :hover {
  background-color: #D1E8FF ;
}

.d2 :hover {
  background-color: #D1E8FF ;
}


.el-link :hover{
  color: #409EFF;
  border-bottom: 3px solid #409EFF;
}



</style>